import React, {Component} from 'react';

import {
    StyleSheet,
    Text,
    View,
    Platform,
    Dimensions, TouchableOpacity, TextInput,
} from 'react-native';

import HttpUtils from '../../utils/HttpUtils';
import HttpUrls from '../../utils/HttpUrls';
import Header from '../../components/header';
import {ToastToUser} from "../../utils/CustomToast";
import Constant from "../../utils/Constant";

const isIos = Platform.OS == 'ios';
const screenW = Dimensions.get('window').width;
const screenH = Dimensions.get('window').height;

let navigation;

export default class InFormPage extends Component {
    constructor(props) {
        super(props);
        this.state = {
            textNum: 0,
            content: '',
        };
    }

    componentDidMount() {

    }

    render() {
        navigation = this.props.navigation;
        return (
            <View style={styles.container}>
                {/*<Header navigation={navigation} Title="投诉举报" />*/}
                <Header navigation={navigation} Title={'投诉举报'} hideSepLine={true} RightButton={() => this.renderRightButton()} />


                <View style={{ width: '100%' }}>
                    <Text style={{ marginLeft: 15, marginTop: 15, fontSize: 16, color: '#333333' }}>投诉该账号的原因:</Text>
                    <TextInput
                        style={styles.inputStyle}
                        placeholder="请描述您的投诉的内容"
                        multiline={true}
                        maxLength={500}
                        onChangeText={(input) => {

                            this.setState({
                                textNum: input.length,
                                content: input
                            })
                        }}>

                    </TextInput>

                    <Text style={styles.textNum}>您还可以输入{500 - this.state.textNum}字</Text>

                </View>

            </View>
        );
    }

    renderRightButton() {
        return (
            <TouchableOpacity
                style={styles.submitContainer}
                activeOpacity={0.8}
                onPress={() => {
                    this.feedBackSubmit()
                }}>
                <Text style={styles.submitText}>提交</Text>
            </TouchableOpacity>
        )
    }

    feedBackSubmit() {

        const { userPhone, userFullname} = this.props.route.params || {}

        if (this.state.content.length == 0) {
            ToastToUser('请输入反馈内容')
            return
        }

        const content = `投诉对象: ${userFullname}(${userPhone}) 投诉内容:${this.state.content}`

        let params = {
            userId: Constant.userInfo.userId,
            phone: this.state.phone,
            fullname: Constant.userInfo.fullname,
            merchantName: Constant.userInfo.merchantName,
            content: content
        }

        HttpUtils.postRequest(HttpUrls.feedBack, params)
            .then((result) => {
                let code = result.code
                if (code == 0) {
                    let data = result.data
                    ToastToUser('举报成功')
                    this.props.navigation.goBack()
                }
            })
            .catch((error) => {

            });
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F9F9F9',
    },

    submitContainer: {
        justifyContent: 'center',
        alignItems: 'center'
    },
    submitText: {
        fontSize: 16,
        color: '#333333'
    },

    inputStyle: {

        marginLeft: 15,
        marginRight: 15,
        height: 150,
        backgroundColor: '#fff',
        borderRadius: 4,
        marginTop: 10,
        borderWidth: 1,
        borderColor: '#e3e3e3',
        padding: 10,
        textAlignVertical: 'top',
        fontSize: 14
    },

    textNum: {
        position: 'absolute',
        right: 25,
        bottom: 10,
        fontSize: 12,
        color: '#999999'
    },


});
